<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui" template="/template/template.xhtml">

	<ui:define name="center">
		<f:event type="preRenderView" listener="#{connexionManagedBean.checkConnected}" />
		
		<h1 class="title ui-widget-header ui-corner-all">
			<h:outputText value="#{msg['orderhistory.title']}" />
		</h1>
		<p:panel header="#{msg['orderhistory.panel.title']}">
			<h:form>
			<p:messages autoUpdate="true" globalOnly="true" showDetail="true" />
			<p:dataTable var="order" value="#{orderHystoryBean.history}">
				<p:column>
					<f:facet name="header">
						<h:outputText value="#{msg['orderhistory.column.date']}" />
					</f:facet>
					<h:outputText value="#{order.date}" />
				</p:column>
				<p:column>
					<f:facet name="header">
						<h:outputText value="#{msg['orderhistory.column.total']}" />
					</f:facet>
					<h:outputText value="#{order.total}" />
				</p:column>
				<p:column>
					<f:facet name="header">
						<h:outputText value="#{msg['orderhistory.column.nblivres']}" />
					</f:facet>
					<h:outputText value="#{order.items.size()}" />
				</p:column>
				<p:column>
					<f:facet name="header">
						<h:outputText value="#{msg['orderhistory.column.details']}" />
					</f:facet>
					<p:commandButton ajax="true" value="Details" oncomplete="detailDialog.show()" update=":detailDialog">
						<f:setPropertyActionListener target="#{orderHystoryBean.selectedOrder}" value="#{order}" />
					</p:commandButton>
				</p:column>
			</p:dataTable>
			</h:form>
		</p:panel> 

		<p:dialog id="detailDialog" dynamic="true" hideEffect="fade"
			closable="true" modal="true" widgetVar="detailDialog" 
			header="#{msg['orderhistory.details.header']}">
			<h:form>
				<p:dataTable var="item" value="#{orderHystoryBean.selectedOrder.items}" rendered="#{orderHystoryBean.selectedOrder ne null}">
					<p:column>
						<f:facet name="header">
							<h:outputText value="#{msg['orderhistory.details.title']}" />
						</f:facet>
						<h:outputText value="#{item.book.title}" />
					</p:column>
					<p:column>
						<f:facet name="header">
							<h:outputText value="#{msg['orderhistory.details.quantity']}" />
						</f:facet>
						<h:outputText value="#{item.quantity}" />
					</p:column>
					<p:column>
						<f:facet name="header">
							<h:outputText value="#{msg['orderhistory.details.total']}" />
						</f:facet>
						<h:outputText value="#{item.total}" />
					</p:column>
				</p:dataTable>
				<br/>
				<p:commandButton action="#{orderHystoryBean.print}" 
								value="Imprimer"  
								styleClass="right" 
								ajax="false"/>
			</h:form>
		</p:dialog>

	</ui:define>
</ui:composition>